<template>
    <div>
      <van-nav-bar
  title="房屋管理"
  left-arrow
  @click-left="onClickLeft"
  :style="{background:'#21b97a'}"
/> 


 <ul>
        <li v-for="item in list" :key="item.id" @click="goxiangqing(item.houseCode)">
            <div>
                <img src="../assets/1.png" alt="">
            </div>
            <div>
             <p>{{item.title}}</p>
             <p>{{item.desc}}</p>
             <p>{{item.tags[0]}}</p>
             <p>{{item.price}}元/月</p>
            </div>
            
        </li>
    </ul>
    

    </div>
</template>

<script>
import axios from 'axios'

export default {
    name: 'dada10dad',

    data() {
        return {
          list:[],   
        };
    },

   created(){
   this.getlist()
   },

    mounted() {
        
    },

    methods: {
        onClickLeft() {
       this.$router.push({ 
         path:'/layout/wode', 
          }) 
    },
     
     goxiangqing(houseCode){
        this.$router.push({
            path:`/xiangqing?id=${houseCode}`
        })
    },


    async getlist(){
   try{
      const res = await axios({
      method:'get',
      url:'http://liufusong.top:8080/houses?AREA%7Cdbf46d32-7e76-1196' 
  })
      console.log(res.data.body.list);
      this.list = res.data.body.list
  }
   catch(e){
      console.log(e);
  }
}


    },
};
</script>

<style lang="less" scoped>
ul {
       display: flex;
       flex-wrap: wrap;
       justify-content: space-evenly; 
    li {
    list-style: none;
    width: 99%;
    border-bottom: 1px solid #e5e5e5;
      display: flex;
       
       img{
            width: 100px;
            height: 90px;
            object-fit: cover;
            margin-right: 10px;
        }
        p{
            line-height: 11px;
        }
}
}
</style>